<template>
  <el-container>
    <el-main class="main-bg">
      <el-form ref="searchForm" :model="searchForm" label-width="100px">
        <el-row>
          <el-col :span="6">
            <el-form-item label="企业名称">
              <el-input
                v-model="searchForm.q_unitName"
                placeholder="请输入企业名称"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="检测机构">
              <el-input
                v-model="searchForm.q_institutionName"
                placeholder="请输入检测机构"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12" class="text-right">
            <el-button
              type="primary"
              icon="iconfont iconxianxing_sousuo"
              @click="handleSearch"
            >
              查询
            </el-button>
            <el-button
              type="warning"
              icon="iconfont iconxianxing_zhongzhi"
              @click="handleReset"
            >
              重置
            </el-button>
          </el-col>
          <el-col :span="24" class="text-left">
            <el-button type="primary" @click="handleDetail"> 新增 </el-button>
            <el-button type="danger" @click="handleDelete">
              批量删除
            </el-button>
          </el-col>
        </el-row>
      </el-form>
      <Table
        ref="table"
        class="data-table"
        style="width: 100%"
        :current-page="page"
        :page-size="limit"
        :total="total"
        :index="false"
        :table-data="tableData"
        :header-data="tableHeader"
        :loading="loading"
        @now-page="handlePage"
        :selection="true"
        @select-change="handleSelectionChange"
        @now-size="handleSize"
        @table-sort="handleSort"
      />
    </el-main>
  </el-container>
</template>

<script>
import addtable from "@/mixins/addtable";
import eventType from "@/mixins/eventType";
import { getReportList, deleteList } from "./api";
export default {
  mixins: [addtable, eventType],
  data() {
    return {
      searchForm: {
        q_unitName: "",
        q_institutionName: "",
      },
      detailId: "",
      tableHeader: [],
      personOptions: [],
      oneLoading: false,
      testing_report_ids: "",
    };
  },
  created() {
    const _this = this;
    this.tableHeader = [
      {
        prop: "unitName",
        label: "防雷单位",
        sortable: false,
        overflow: true,
        align: "left",
      },
      {
        prop: "chargePerson",
        label: "企业负责人",
        sortable: false,
        overflow: true,
        align: "left",
      },
      {
        prop: "linkTelephone",
        label: "联系电话",
        sortable: false,
        overflow: true,
        align: "left",
      },
      {
        prop: "institutionName",
        label: "检测机构",
        sortable: false,
        overflow: true,
        width: 180,
        align: "left",
      },
      {
        prop: "reportName",
        label: "报告名称",
        sortable: false,
        overflow: true,
        align: "left",
      },
      {
        prop: "startValidate",
        label: "检测报告有效期",
        sortable: false,
        overflow: true,
        align: "left",
      },
      {
        prop: "endValidate",
        label: "检测报告有效期结束",
        sortable: false,
        overflow: true,
        align: "left",
      },

      {
        prop: "checkStatus",
        label: "检查状态",
        sortable: false,
        overflow: true,
        align: "left",
        render: (h, vm) => {
          const arr = _this.PLUGINS_MET_INSPECT_STATUS.filter((item) => {
            return vm.checkStatus == item.codeValue;
          });
          return <span>{arr[0].codeName}</span>;
        },
      },

      {
        width: 150,
        label: "操作",
        align: "left",
        fixed: "right",
        buttonList: (row, index) => {
          let arr = [
            {
              text: "删除",
              type: "text",
              className: "text-danger",
              event: this.handleDelete,
            },
          ];
          if (row.signStatus !== 3) {
            arr.push({
              text: "签署",
              type: "text",
              event: this.handleLook,
            });
          }
          if (row.signStatus === 3) {
            arr.push({
              text: "查看报告",
              type: "text",
              event: this.handleLook,
            });
          }
          return arr;
        },
      },
    ];
    this.getTableData();
  },

  methods: {
    handleDetail(row) {
      this.$router.push({
        name: "uploadWaterMark",
        query: {
          reportId: row.testingReportId,
        },
      });
    },
    handleLook(row) {
      this.$router.push({
        name: "uploadIframe",
        query: {
          reportId: row.testingReportId,
          readonly: 1,
        },
      });
    },
    getTableData() {
      this.loading = true;
      this.getTableParams();
      getReportList(this.tableParams)
        .then((res) => {
          if (!res) return;
          const { data, totalCount } = res;
          setTimeout(() => {
            this.loading = false;
            this.total = totalCount;
            this.tableData = data;
            // .filter((item) => item.signStatus == 1 || item.signStatus == 0)
          }, 500);
        })
        .catch((err) => {
          console.log("TCL: getTableData -> err", err);
        });
    },
    handleSelectionChange(v) {
      let ids = [];
      v.map((item) => {
        ids.push(item.testingReportId);
      });
      this.testing_report_ids = ids.join(",");
    },
    handleDelete(row) {
      if (row.testingReportId) {
        this.testing_report_ids = row.testingReportId;
      }
      if (!this.testing_report_ids) {
        this.$message({
          type: "warning",
          message: "请至少选择一行数据进行删除！",
        });
        return;
      }
      this.$confirm("您确认要删除该数据么？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        cancelButtonClass: "btn-custom-cancel",
      }).then(() => {
        deleteList({ testing_report_ids: this.testing_report_ids }).then(
          ({ success, message }) => {
            this.$message({
              type: success ? "success" : "error",
              message: message,
            });
            if (success) {
              this.plan_ids = "";
              this.getTableData();
            }
          }
        );
      });
    },
  },
};
</script>
